<template>
    <div class="h100">
      <div class="layout-container">
          <router-view v-if="routePath && routePath.meta && routePath.meta.activePath" :key="routePath.meta.activePath"></router-view>
      </div>
    </div>
  </template>
  
  <script>
  import { reactive, toRefs, computed, onMounted, nextTick  } from 'vue'
  import { storeToRefs } from 'pinia';
  import { useThemeConfig } from '/@/stores/themeConfig';
  import { useRoute } from 'vue-router'
  export default {
      name: 'OrderIndex',
      setup() {
          const storesThemeConfig = useThemeConfig();
          const { themeConfig } = storeToRefs(storesThemeConfig);
          const route = useRoute()
          const state = reactive({
              refreshRouterViewKey: null,
              routePath: {}
          })
          // 设置主界面切换动画
          const setTransitionName = computed(() => {
              return themeConfig.value.animation;
          });
          onMounted(() => {
              nextTick(() => {
                  state.routePath = route
              })
          })
          return {
              ...toRefs(state),
              setTransitionName
          }
      }
  }
  </script>
  
  <style scoped lang="scss">
  .h100{
      min-height: 100vh;
  }
  </style>